<script lang="jsx">
import { lawyerConflict } from '@/api/court'
import ConfigForm from '@/components/CRUD/ConfigForm.vue'
import { computed, ref, render, toRaw } from 'vue'

export default {
  components: {
    ConfigForm,
  },
  props: {
    info: {
      default: {},
      type: Object,
    },
    courtUserList: {
      default: {},
      type: Object,
    },
  },
  emits: ['success', 'close'],
  setup(props, { emit }) {
    console.log(props)
    const hideLawyerDetial = ref(false)
    const createForm = computed(() =>
      [
        {
          label: '开庭律师',
          key: 'open_court_user_name',
          type: 'select',
          options: props.courtUserList,
        },
        {
          label: '',
          key: '',
          type: 'custom',
          render: (row) => {
            return (
              <>
                <div class="w-full">
                  <span class="text-[red] font-[700]">
                    {row.open_court_user_name}律师与此开庭时间冲突
                  </span>
                  <div class="flex flex-col bg-gray-200 p-2 mt-1 rounded-[6px]">
                    <span>编号：{row.id}</span>
                    <span>原告：{row.id}</span>
                    <span>被告：{row.id}</span>
                    <span>开庭律师：{row.open_court_user_name}</span>
                    <span>开庭法院：{row.court_name}</span>
                    <span>开庭时间：{row.open_datetime}</span>
                  </div>
                </div>
              </>
            )
          },
        },
      ].filter((item) => item.key || (hideLawyerDetial.value && !item.key)),
    )
    const onClose = () => {
      emit('close')
    }
    const onSuccess = () => {
      hideLawyerDetial.value = true
      // emit('success')
    }

    return () => (
      <>
        <ConfigForm
          rowKey="open_date"
          configs={createForm.value}
          server={{ lawyerConflict }}
          onSuccess={onSuccess}
          onClose={onClose}
        ></ConfigForm>
      </>
    )
  },
}
</script>
